import React from 'react'
import Logo from '../../components/logo/logo'
import { List, Radio, InputItem, WhiteSpace,WingBlank,Button } from 'antd-mobile';
import { connect} from  'react-redux'
import {Redirect} from 'react-router-dom'
import {regisger} from '../../redux/user-redux';



@connect(
    state=>state.user,
    {regisger}        
    
)
class Register extends React.Component{
    constructor(props){
        super(props)
        this.state = {
            user:'',
            pwd:'',
            repeatpwd:'',
            type: 'genius'
        }

        this.handleRegister = this.handleRegister.bind(this)
    
    }
    handleChange(key,value){
        this.setState({
            [key]:value
        })
    }
  handleRegister(){
    this.props.regisger(this.state)

  }
    
    render(){
        const RadioItem =Radio.RadioItem
        return(
            <div>

            {this.props.redirectTo ? <Redirect to={this.props.redirectTo} />:null}
            <Logo></Logo>
            <List>
            {this.props.msg ? <p>{this.props.msg}</p> : null}
               <InputItem
               onChange = {v=>{this.handleChange('user',v)}}
               >用户名</InputItem>
               <WhiteSpace/>
               <InputItem
               type='password'
                onChange = {v=>{this.handleChange('pwd',v)}}
               >密码</InputItem>
                  <WhiteSpace/>
               <InputItem
               type='password'
                onChange = {v=>{this.handleChange('repeatpwd',v)}}
               >确认密码</InputItem>
                  <WhiteSpace/>
               <RadioItem checked = {this.state.type == 'genius'}
                    onChange = {()=>{this.handleChange('type','genius')}}
               >牛人</RadioItem>
                  <WhiteSpace/>
             <RadioItem checked = {this.state.type == 'boss'}
             onChange = {v=>{this.handleChange('type','boss')}}
             >boss</RadioItem>
                <WhiteSpace/>
               <Button type='primary' onClick={this.handleRegister}>注册</Button>
            </List>
            <h1>注册页</h1>
            </div>
        )
    }
}



export default Register
